<!--
/**
 * 学习课程 列表页 JS 脚本
 * @author 金杰 , maillank@qq.com
 * @since 2024-09-18 16:56:41
 */
 -->
<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8"/>
    <meta name="referrer" content="no-referrer">
    <title th:text="${lang.translate('学习')}">学习</title>
    <link th:if(theme.ico!="null") rel="shortcut icon" th:href="${theme.ico}" type="image/vnd.microsoft.icon">
    <link th:if(theme.ico!="null") rel="icon" th:href="${theme.ico}" type="image/vnd.microsoft.icon">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/assets/libs/layui/css/layui.css" th:href="'/assets/libs/layui/css/layui.css?'+${cacheKey}"/>
    <link rel="stylesheet" href="/assets/css/admin.css" th:href="'/assets/css/admin.css?'+${cacheKey}"/>
    <link rel="stylesheet" href="/assets/libs/toast/css/toast.css" type="text/css" th:href="'/assets/libs/toast/css/toast.css?'+${cacheKey}">
    <link rel="stylesheet" href="/assets/css/foxnic-web.css" th:href="'/assets/css/foxnic-web.css?'+${cacheKey}">
    <link href="/assets/libs/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
    <link href="/assets/libs/material-design-webfont/css/material-design-icons-min.css" rel="stylesheet">
    <link href="/assets/ckplayer/css/ckplayer.css" rel="stylesheet">
    <script th:inline="javascript">var foxnic_cachekey=[[${cacheKey}]];</script>
    <style>
        .top-container {
            margin-top:30px;
            display: -webkit-flex; /* Safari */
            display: flex;
            width: 100%;
            align-items:top;
        }
        .left-tree {
            overflow:scroll;
            width:70%;
            height:750px!important;
            /*background-color:red;*/
            background-color: #ffffff;
            border-right: 1px #e6e6e6 solid;
        }
        .right-tab {
            flex:1;
        }

    </style>
    <link th:each="css:${theme.css}" rel="stylesheet" th:href="${css}+'?'+${cacheKey}">
</head>
<script type="text/javascript" src="/module/global.js" th:src="'/module/global.js?'+${cacheKey}"></script>
<script type="text/javascript" src="/assets/libs/jquery-3.2.1.min.js" th:src="'/assets/libs/jquery-3.2.1.min.js?'+${cacheKey}"></script>
<script type="text/javascript" src="/assets/libs/pandyle.min.js" th:src="'/assets/libs/pandyle.min.js?'+${cacheKey}"></script>
<script type="text/javascript" src="/assets/libs/layui/layui.js" th:src="'/assets/libs/layui/layui.js?'+${cacheKey}"></script>
<script type="text/javascript" src="/assets/libs/toast/js/toast.js" th:src="'/assets/libs/toast/js/toast.js?'+${cacheKey}"></script>
<script th:src="'/assets/ckplayer/js/ckplayer.min.js?'+${cacheKey}"></script>

<body style="">
<div style="margin-top:100px;margin-left:200px;font-size: 32px" id="msg"></div>

<div class="top-container" id="file">
    <div class="left-tree">
        <iframe id="mainFrame" src="" title="预览" frameborder="no" width="100%" height="70%"></iframe>
    </div>
    <div class="right-tab" style="margin-left: 8px;margin-right: 8px">
        <div style="margin-top:50px;margin-left:50px;">
            <button id="finishFile" class="layui-btn finishFile " lay-event="finishFile"><span th:text="${lang.translate('结束','','cmp:table.ops')}">结束</span></button>
        </div>
    </div>
</div>

<div class="top-container" id="video">
    <div class="left-tree">
        <div style="width:100%;display: flex;justify-content: center;align-items: center">
            <div class="video" style="width: 800px;height: 600px;">播放器容器</div>
        </div>
    </div>
    <div class="right-tab" style="margin-left: 8px;margin-right: 8px">
        <div style="margin-top:50px;margin-left:50px;">
            <button id="finishVideo" class="layui-btn finishVideo " lay-event="finishVideo"><span th:text="${lang.translate('结束','','cmp:table.ops')}">结束</span></button>
        </div>
    </div>
</div>


<script th:inline="javascript">
    var AUTH_PREFIX="hr_learn_view";
    var result=[[${result}]];
    var msg=[[${msg}]];
    var role=[[${role}]];
    var taskData=[[${taskData}]];
    var learnData=[[${learnData}]];
    var learnReleaseData=[[${learnReleaseData}]];

</script>
<script>
    // var h=window.screen.height;
    // console.log("h",h);
    // $("#left-tree").height(h-200);
    if(result){
        $("#msg").remove();
        if(learnData.type=="file"){
            $("#video").remove();
            document.getElementById("mainFrame").style.height = "0px";//最好设置为minHeight
            console.log("learnData",learnData);
            var url="/assets/pdfview/web/viewer.html?file=/service-storage/sys-file/download@id="+learnData.fileId;
            $("#mainFrame").attr("src", url);
            startInit('mainFrame', 1000);
            var browserVersion = window.navigator.userAgent.toUpperCase();
            var isOpera = browserVersion.indexOf("OPERA") > -1 ? true : false;
            var isFireFox = browserVersion.indexOf("FIREFOX") > -1 ? true : false;
            var isChrome = browserVersion.indexOf("CHROME") > -1 ? true : false;
            var isSafari = browserVersion.indexOf("SAFARI") > -1 ? true : false;
            var isIE = (!!window.ActiveXObject || "ActiveXObject" in window);
            var isIE9More = (! -[1,] == false);
            function reinitIframe(iframeId, minHeight) {
                try {
                    var iframe = document.getElementById(iframeId);
                    var bHeight = 0;
                    if (isChrome == false && isSafari == false) {
                        try {
                            bHeight = iframe.contentWindow.document.body.scrollHeight;
                        } catch (ex) {
                        }
                    }
                    var dHeight = 0;
                    if (isFireFox == true)
                        dHeight = iframe.contentWindow.document.documentElement.offsetHeight + 2;//如果火狐浏览器高度不断增加删除+2
                    else if (isIE == false && isOpera == false && iframe.contentWindow) {
                        try {
                            dHeight = iframe.contentWindow.document.documentElement.scrollHeight;
                        } catch (ex) {
                        }
                    }
                    else if (isIE == true && isIE9More) {//ie9+
                        var heightDeviation = bHeight - eval("window.IE9MoreRealHeight" + iframeId);
                        if (heightDeviation == 0) {
                            bHeight += 3;
                        } else if (heightDeviation != 3) {
                            eval("window.IE9MoreRealHeight" + iframeId + "=" + bHeight);
                            bHeight += 3;
                        }
                    }
                    else//ie[6-8]、OPERA
                        bHeight += 3;

                    var height = Math.max(bHeight, dHeight);
                    if (height < minHeight) height = minHeight;
                    //alert(iframe.contentWindow.document.body.scrollHeight + "~" + iframe.contentWindow.document.documentElement.scrollHeight);
                    iframe.style.height = height + "px";
                } catch (ex) { }
            }
            function startInit(iframeId, minHeight) {
                eval("window.IE9MoreRealHeight" + iframeId + "=0");
                window.setInterval("reinitIframe('" + iframeId + "'," + minHeight + ")", 100);
            }
        }else if(learnData.type=="video"){
            $("#file").remove();
            var url="/service-storage/sys-file/download?id="+learnData.videoId+"&fdType=file";
            //定义一个变量：videoObject，用来做为视频初始化配置
            var videoObject = {
                container: '.video', //“#”代表容器的ID，“.”或“”代表容器的class
                video: url//视频地址
            };
            var player = new ckplayer(videoObject);//初始化播放器
        }

    }else{
        $("#video").remove();
        $("#file").remove();
        $("#msg").html(msg);
    }



</script>
<script th:src="'/business/oa/netdisk_file/view_pdf_ext.js?'+${cacheKey}"></script>
<script th:src="'/business/oa/netdisk_file/view_pdf.js?'+${cacheKey}"></script>
<script th:src="'/business/hr/learn/learn_view_ext.js?'+${cacheKey}"></script>
<script th:src="'/business/hr/learn/learn_view.js?'+${cacheKey}"></script>

</body>
</html>